<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>

<html>
	<head>
		<title>查看流程图</title>
		<%@ include file="/common/meta.jsp"%>
		<%@ include file="/common/jquery-ui-inc.jsp"%>
		<style> 
			.w{  position:absolute; background:#999; font-size:12px; text-align:left;} 
			/* .x{  position:relative; background:#ff9; border:1px solid #F96; padding:10px; left:-4px; top:-4px;}  */
			.x{  position:relative; background:#f0fbeb; border:1px solid #9bdf70; padding:10px; left:-4px; top:-4px;}
		</style>
		<script type="text/javascript">
		 function showNodeInfo(flag){
		   if(flag == "F"){
		     $("#nodeInfow").hide();
		   }else{
		     $("#nodeInfow").show();
		   }
		 }
		 
		function jsonpGetNodeInfo(){ 
		  var getNodeInfoUrl= "${ctx}/flow/core/flow-webservice!getPicNodeInfo.action?processInsId=${processInsId}";
	        $.ajax({
				type:'post',
				url:getNodeInfoUrl,
				dataType:'jsonp',
				jsonp:"jsoncallback",  
				contentType: "application/x-www-form-urlencoded; charset=utf-8", 
				success:function(json){
				      var flag = json.flag;
				      var msg = json.message;
				      var activityName = json.activityName;
				      var assignees = json.assignees;
				      if(flag == "true"){
				         //alert("当前节点："+activityName+"；任务执行人："+assignees);
				         if(assignees != null && assignees != "" ){
					         $.messager.alert('当前节点：'+activityName, '任务执行人：'+assignees , 'info' ,function(){
			    			   $("#nodeInfox").html("<p>任务执行人为："+assignees+"</p>");
			                 });
				         }else{
				           $.messager.alert('', '当前节点：'+activityName, 'info' ,function(){});
				           $("#nodeInfow").remove();
				         }
				      }else{
				        $.messager.alert('', '查询节点信息失败：'+msg, 'info' ,function(){});
				        $("#nodeInfow").remove();
				      }
					},
				error:function(XMLHttpRequest, textStatus, errorThrown){
				     //$.messager.alert('', '查询节点信息发生异常！', 'error' ,function(){});
				     $("#nodeInfow").remove();
					 //alert(XMLHttpRequest.status);
	                 //alert(XMLHttpRequest.readyState);
	                 //alert(textStatus);
					 //alert("请检查服务器！");
					}
				});
		}
		
		$(function(){
			 jsonpGetNodeInfo();
		});
		</script>
	</head>

	<body>
	<img src="${ctx}/flow/core/flow-view-pic!getProcessPic.action?processInsId=${processInsId}" style="position:absolute;left:0px;top:0px;">
	<s:iterator value="list_ac" var="ac">
		<div style="position:absolute;border:1px solid red;left:${ac.x}px;top:${ac.y}px;width:${ac.width}px;height:${ac.height}px;" onmouseover="showNodeInfo('T')" onmouseout="showNodeInfo('F')"></div>
		<div class="w" id="nodeInfow" style="left:${ac.x+100}px;top:${ac.y-10}px;display: none;"><div class="x" id="nodeInfox"></div></div> 
	</s:iterator>
	
	</body>
</html>